{yun:}include file="$wapstyle/member/cheader.htm"{/yun} 
<link rel="stylesheet" type="text/css" href="{yun:}$wap_style{/yun}/js/webapppic/css/cropper.min.css?v={yun:}$config.cachecode{/yun}"/> 
<link rel="stylesheet" type="text/css" href="{yun:}$wap_style{/yun}/js/webapppic/css/mui.min.css?v={yun:}$config.cachecode{/yun}"/> 
<script src="{yun:}$wap_style{/yun}/js/webapppic/js/lrz6.mobile.min.js?v={yun:}$config.cachecode{/yun}" language="javascript"></script>  
<script src="{yun:}$wap_style{/yun}/js/webapppic/dist/lrz.all.bundle.js?v={yun:}$config.cachecode{/yun}" language="javascript"></script>  
<script src="{yun:}$wap_style{/yun}/js/webapppic/js/cropper.min.js?v={yun:}$config.cachecode{/yun}" language="javascript"></script>  
<script>
 $(function() {

        function toFixed2(num) {
            return parseFloat(+num.toFixed(2));
        }
		
        $('#cancleBtn').on('click', function() {
            $("#showEdit").fadeOut();
            $('#showResult').fadeIn();
        });

        $('#confirmBtn').on('click', function() {
            $("#showEdit").fadeOut();

            var $image = $('#report > img');
            var dataURL = $image.cropper("getCroppedCanvas");
            var imgurl = dataURL.toDataURL("image/jpeg", 0.5);
            $("#changeAvatar > img").attr("src", imgurl);
            $("#uimage").val(imgurl);
            $('#showResult').fadeIn();

        });

        function cutImg() {
            $('#showResult').fadeOut();
            $("#showEdit").fadeIn();
            var $image = $('#report > img');
            $image.cropper({
                aspectRatio: 185 /75,
                autoCropArea: 0.7,
                strict: true,
                guides: false,
                center: true,
                highlight: false,
                dragCrop: false,
                cropBoxMovable: false,
                cropBoxResizable: false,
                zoom: -0.2,
                checkImageOrigin: true,
                background: false,
                minContainerHeight: 400,
                minContainerWidth: 300
            });
        }

        function doFinish(startTimestamp, sSize, rst) {
            var finishTimestamp = (new Date()).valueOf();
            var elapsedTime = (finishTimestamp - startTimestamp); 

            var sourceSize = toFixed2(sSize / 1024),
                resultSize = toFixed2(rst.base64Len / 1024),
                scale = parseInt(100 - (resultSize / sourceSize * 100));
            $("#report").html('<img src="' + rst.base64 + '" style="width: 100%;height:100%">');
            cutImg();
        }

        $('#image').on('change', function() {
            var startTimestamp = (new Date()).valueOf();
            var that = this;
            lrz(this.files[0], {
                    width: 800,
                    height: 800,
                    quality: 0.7
                })
                .then(function(rst) { 
                    doFinish(startTimestamp, that.files[0].size, rst);
                    return rst;
                })
                .then(function(rst) { 
                    // 这里该上传给后端啦
                    // 伪代码：ajax(rst.base64)..
					//photo();
                    return rst;
                })
                .then(function(rst) {
                    // 如果您需要，一直then下去都行
                    // 因为是Promise对象，可以很方便组织代码 \(^o^)/~
                })
                .catch(function(err) {
                    // 万一出错了，这里可以捕捉到错误信息
                    // 而且以上的then都不会执行

                    alert(err);
                })
                .always(function() {
                    // 不管是成功失败，这里都会执行
                });
        });

    });
	
function photo(){ 
	var uimage=$("#uimage").val(); 
	if(uimage==''){
	    layermsg('头像未改变，无需修改');return false;
	}
	var regS = new RegExp("\\+","gi"); 
	uimage=uimage.replace(regS,"#");
	$.ajax({ 
		type: 'POST', 
		url: "index.php?c=photo" ,
		cache:false,
		dataType:'json', 
		data: {uimage:uimage,submit:1} , 
		success: function(msg){
			
			if(msg=='1'){
				var date='操作成功！';
			}else{
				var date='操作失败！';
			}
			layermsg(date,2,function(){/*location.reload();*/window.location.href =wapurl+"/member/index.php";});return false;
		}
	});
}	
</script>
<style>
.photo_i_box{width:120px;height:120px; background:#fff}
</style>
<section class="resume_mangage"> 
    <div class="clear"></div>
    <div class="verify">
		<div class="photo_i_box_v">
			<div id="showResult">
				<div id="changeAvatar" class="photo_i_box">                                        
                    <img src="{yun:}$config.sy_weburl{/yun}/{yun:}$company.logo{/yun}" onerror="showImgDelay(this,'{yun:}$config.sy_weburl{/yun}/{yun:}$config.sy_unit_icon{/yun}',2);" width="120" height="120">                                        
				</div> 
				<div class="clear"></div>
				<div style="width: 185px; overflow:hidden;margin: 40px auto 0;" class="photo_i_box_in"> 
					<input id="image" type="file" accept="image/*"/>
                    
				</div>  
			</div>
			<div id="showEdit" style="display: none;width:100%;height: 100%;position: absolute;top:0;left: 0;z-index: 9;">
				<div style="width:100%;position: absolute;top:10px;left:0px;">
					<button class="mui-btn" data-mui-style="fab" id='cancleBtn' style="margin-left: 10px;">取消</button>
					<button class="mui-btn" data-mui-style="fab" data-mui-color="primary" id='confirmBtn' style="float:right;margin-right: 10px;">确定</button>
				</div>
				<div id="report"></div>			
			</div>
			<div style="width:98%; margin:50px auto;">
			<input type='hidden' name="txt" id="uimage" value="">
			<input name="submit"  type="button" onclick="photo()" value="保存/修改" class="photo_i_box_subbc"/>
			</div>
		</div> 
	</div> 
</section>
</div> 
<div class="clear"></div>
{yun:}include file="$wapstyle/footer.htm"{/yun} 
